<template>
	<view>
		<view class="page">
			<view class="top" :style="`padding-top:` + $store.state.StatusBar.statusBar + `px`">
				<view class="top-icon" @click="back">
					<u-icon name="arrow-left" size="42rpx" color='#fff'></u-icon>
					
				</view>
				<view class="top-title c-fff">{{ title }}</view>
			</view>
			<view class="body" :style="`margin-top:` + $store.state.StatusBar.statusBar + `px`">
				<view class="list">
					<view class="item" @tap="to('/pages/m-pages/m-password/index')">
						<view class="label c-fff">修改密码</view>
						<view class="top-infr-icon">
							<image class="img"
								src=""
								mode="aspectFill"></image>
						</view>
					</view>
					<view class="item">
						<view class="label c-fff" @tap="setupConfirm">账户注销</view>
						<view class="top-infr-icon">
							<image class="img"
								src=""
								mode="aspectFill"></image>
						</view>
					</view>
				</view>
				<view class="button" @click="quit">退出登录</view>
			</view>
		</view>
	</view>
</template>

<script>
import { to } from '@/utils/index.js';
export default {
	data() {
		return {
			info: {},
			cacheSize: '',
			idNum: '',
			version: '',
			realName: ''
		}
	},
	onLoad(option) {

	},
	onShow(option) {
		this.getInfo();
	},
	methods: {
		to,
		back() {
			to()
		},
		getAppInfo() {
			// #ifdef APP-PLUS
			let self = this;
			plus.cache.calculate(size => {
				if (size < 1024) {
					self.cacheSize = size + 'B';
				} else if (size / 1024 >= 1 && size / 1024 / 1024 < 1) {
					self.cacheSize = Math.floor((size / 1024) * 100) / 100 + 'KB';
				} else if (size / 1024 / 1024 >= 1) {
					self.cacheSize = Math.floor((size / 1024 / 1024) * 100) / 100 + 'M';
				}
			});
			// #endif
			// #ifdef H5
			let storageInfo = uni.getStorageInfoSync()
			console.log(storageInfo)
			this.cacheSize = storageInfo.currentSize.toString() + "KB";
			// #endif
		},
		setupConfirm() {
			uni.showModal({
				title: "操作确认",
				content: "确认要注销账户吗?",
				success: (res) => {
					if (res.confirm) {
						this.setup()
					}
				}
			})
		},
		async setup() {
			let that = this;
			let res = await this.$c.post("/app/setup/writeOff");
			uni.clearStorageSync()
			uni.showToast({
				title: '注销成功',
				icon: 'none',
			});
			setTimeout(() => {
				uni.redirectTo({
					url: '/im/login/login',
				});
			}, 1000);
		},
		quit() {
			uni.$TUIKit.logout().then(() => {
				uni.clearStorage();
				uni.showToast({
					title: '退出成功',
					icon: 'none',
				});
				setTimeout(() => {
					uni.redirectTo({
						url: '/im/login/login',
					});
				}, 1000);
			}).catch((err) => {
				uni.showToast({
					title: '退出成功',
					icon: 'none',
				});
				setTimeout(() => {
					uni.redirectTo({
						url: '/im/login/login',
					});
				}, 1000);
			});
		},
		async getInfo() {
			// 获取系统信息
			const systemInfo = uni.getSystemInfoSync();
			// 应用程序版本号
			const version = systemInfo.appVersion;
			this.version = version
			this.getAppInfo()
			// let res = await this.$c.post("/app/exchange/getList")
			// if(res.code != 0){
			// 	uni.navigateTo({
			// 	  url: '/im/login/login'
			// 	});
			// }
			// this.info = res.data
		},
		async submit() {
			let res = await this.$c.post("/app/auth/realNameAuthIos?idNum=" + this.idNum + "&realName=" + this.realName)
			if (res.code != 0) {
				uni.showToast({
					title: res.msg,
					icon: "none"
				})
				return;
			}
			uni.showToast({
				title: "提交成功",
				icon: "none"
			})
			setTimeout(() => {
				// this.getInfo()
				this.$router.go(0)
			}, 1000)
		}
	}
}
</script>

<style scoped lang="scss">
.page {
	width: 100vw;
	padding: 30rpx;
	height: 100vh;
	/* background: linear-gradient(#e3ecfb, #fdedf0, #fff, #fff); */
}

.top {
	position: fixed;
	top: 0rpx;
	width: 100%;
	/* background-color: #e3ecfb; */
	z-index: 999;
	text-align: center;
	vertical-align: middle;
	padding: 10rpx;
}

.top-icon {
	position: absolute;
	left: 30rpx;
	z-index: 99;
	width: 30rpx;
	height: 30rpx;
}

.top-title {
	line-height: 50rpx;
	display: block;
	height: 50rpx;
	z-index: 99;
}

.body {
	padding-top: 20rpx;
	text-align: center;

	.title {
		margin-top: 40rpx;
		font-size: 24rpx;
	}

	.top-infr-icon {
		width: 26rpx;
		height: 26rpx;
		position: absolute;
		right: 0rpx;
	}

	.button {
		background: linear-gradient(180deg, #FDB175 5%, #F49C66 100%);
		color: #fff;
		display: inline-block;
		padding: 30rpx 0rpx;
		transform: translateX(-30rpx);
		border-radius: 50rpx;
		font-size: 32rpx;
		width: 80%;
		margin-top: 30rpx;
	}

	.mark {
		width: 100%;
		margin-top: 30rpx;
		text-align: left;
		font-size: 20rpx;
		color: #9d9395;
	}

	.list {
		margin-top: 60rpx;

		.item {
			width: 90vw;
			height: 80rpx;
			line-height: 80rpx;
			margin: 30rpx;
			transform: translateX(-30rpx);
			position: relative;

			.label {
				position: absolute;
				left: 40rpx;
			}

			border-bottom: 1px solid #e2e2e2;
		}
	}
}</style>